<template>
  <el-dialog
    :title="!dataForm.id ? '新建方案' : '编辑方案'"
    :close-on-click-modal="false"
    :close-on-press-escape="false"
    :visible.sync="visible"
    lock-scroll
    :append-to-body="true"
    class="jsbos-dialog jsbos-dialog_center"
    width="900px"
  >
    <el-form
      ref="dataForm"
      :model="dataForm"
      :rules="dataRule"
      v-loading="formLoading"
    >
      <el-form-item prop="enCode">
        <el-input v-model="dataForm.enCode" placeholder="请输入方案编码" />
      </el-form-item>
      <el-form-item prop="fullName">
        <el-input v-model="dataForm.fullName" placeholder="请输入方案名称" />
      </el-form-item>

      <ConditionPane
        v-if="visible"
        ref="conditionPane"
        v-model="conditionValue"
        :moduleId="dataForm.moduleId"
      >
      </ConditionPane>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="visible = false">{{
        $t("common.cancelButton")
      }}</el-button>
      <el-button type="primary" :loading="btnLoading" @click="dataFormSubmit()">
        {{ $t("common.confirmButton") }}</el-button
      >
    </span>
  </el-dialog>
</template>

<script>
import {
  createDataScheme,
  updateDataScheme,
  getDataSchemeInfo,
} from "@/api/system/dataAuthorize";

export default {
  data() {
    return {
      visible: false,
      formLoading: false,
      btnLoading: false,
      dataForm: {
        id: "",
        moduleId: "",
        enCode: "",
        fullName: "",
        conditionJson: "",
        conditionText: "",
        childTableKey: "",
        matchLogic: "and",
      },
      conditionValue: {
        matchLogic: "and",
        conditionJson: [],
        conditionText: "",
      },
      dataRule: {
        fullName: [
          { required: true, message: "方案名称不能为空", trigger: "blur" },
        ],
        enCode: [
          { required: true, message: "请输入编码", trigger: "blur" },
          { max: 50, message: "字典编码最多为50个字符！", trigger: "blur" },
        ],
      },
    };
  },
  methods: {
    clearData(data) {
      for (let key in data) {
        if (data[key] instanceof Array) {
          data[key] = [];
        } else if (data[key] instanceof Object) {
          this.clearData(data[key]);
        } else {
          data[key] = "";
        }
      }
      this.conditionValue = {
        conditionJson: [],
        matchLogic: "and",
      };
    },
    init(moduleId, id) {
      this.dataForm.id = id || "";
      this.visible = true;
      this.$nextTick(() => {
        this.$refs["dataForm"].resetFields();
        if (this.dataForm.id) {
          this.formLoading = true;
          getDataSchemeInfo(this.dataForm.id).then((res) => {
            this.dataInfo(res.data);
            this.formLoading = false;
          });
        } else {
          this.clearData(this.dataForm);
          this.dataForm.moduleId = moduleId;
        }
      });
    },
    dataFormSubmit() {
      this.$refs["dataForm"].validate((valid) => {
        if (valid) {
          this.$refs["conditionPane"].validate((valid2) => {
            console.log("valid2", valid2);
            if (valid2) {
              this.btnLoading = true;
              const formMethod = this.dataForm.id
                ? updateDataScheme
                : createDataScheme;
              var _data = this.dataList();
              formMethod(_data)
                .then((res) => {
                  this.$message({
                    message: res.msg,
                    type: "success",
                    duration: 1500,
                    onClose: () => {
                      this.visible = false;
                      this.btnLoading = false;
                      this.$emit("refreshDataList");
                    },
                  });
                })
                .catch(() => {
                  this.btnLoading = false;
                });
            }
          });
        }
      });
    },
    dataList() {
      var _data = JSON.parse(JSON.stringify(this.dataForm));
      _data.matchLogic = this.conditionValue.matchLogic;
      _data.conditionJson = JSON.stringify(this.conditionValue.conditionJson);
      _data.conditionText = this.conditionValue.conditionText;
      console.log("dataList", _data);
      return _data;
    },
    dataInfo(dataAll) {
      console.log("dataInfo", dataAll);
      let _dataAll = dataAll;
      this.conditionValue = {
        //条件组逻辑
        matchLogic: _dataAll.matchLogic,
        // 条件组列表
        conditionJson: JSON.parse(_dataAll.conditionJson),
        conditionText: _dataAll.conditionText,
      };
      this.dataForm = _dataAll;
    },
  },
};
</script>
